<script setup>
import {rarityStore} from "@/stores/Rarity.js";

const rarityStr = rarityStore()
</script>

<template>
    <el-descriptions column="2" :title="rarityStr.rarity.displayName">
      <el-descriptions-item label="附魔台概率"><span class="span">{{ rarityStr.rarity.tableChance }}%</span></el-descriptions-item>
      <el-descriptions-item label="最低附魔等级"><span class="span">{{ rarityStr.rarity.minimumLevel }}</span></el-descriptions-item>
      <el-descriptions-item label="村民概率"><span class="span">{{ rarityStr.rarity.villagerChance }}%</span></el-descriptions-item>
      <el-descriptions-item label="战利品概率"><span class="span">{{ rarityStr.rarity.lootChance }}%</span></el-descriptions-item>
    </el-descriptions>

<!--<el-dialog v-model="rarityStr.show">-->
<!--  <el-descriptions :title="rarityStr.rarity.displayName">-->
<!--    <el-descriptions-item label="附魔台概率">{{ rarityStr.rarity.tableChance }}%</el-descriptions-item>-->
<!--    <el-descriptions-item label="最低附魔等级">{{ rarityStr.rarity.minimumLevel }}%</el-descriptions-item>-->
<!--    <el-descriptions-item label="村民概率">{{ rarityStr.rarity.villagerChance }}%</el-descriptions-item>-->
<!--    <el-descriptions-item label="战利品概率">{{ rarityStr.rarity.lootChance }}%</el-descriptions-item>-->
<!--  </el-descriptions>-->
<!--</el-dialog>-->
</template>

<style scoped>
.span {
  font-weight: bolder;
}
</style>